import { Component, OnInit } from '@angular/core';
import { JsonApiService } from "app/core/api/json-api.service"; //http请求配置引入
import { config } from '../../shared/smartadmin.config';

declare var $: any;
@Component({
	selector: 'sa-delivery-point',
	templateUrl: './delivery-point.component.html',
})
export class DeliveryPointComponent implements OnInit {
	tableData: any[] = []; //table数据
	resultTableData: any[] = [] //客户端分页数据暂存
	totalCount: number = 0; //分页总条数
	curPage: number = 1; //分页当前页
	pageSize: number = 10; //内置的分页每页条数
	searchKey: string = ''; //搜索keyword
	deliveryList: any[] = [];
	carList: any[] = [];
	companyList: any[] = [];
	companyId: string = ''; //公司ID
	deviceId: string = ''; //设备ID
	stationId: string = ''; //站点ID
	startTime: string = ''; //开始时间
	endTime: string = ''; //结束时间
	selectedCompanyName: string = '';
	selectedCompanyId: string = '';

	constructor(private jsonApiService: JsonApiService) {}
	//刷新
	refresh() {
		this.load();
	}
	ngOnInit() {
		this.initDate().then(() => this.load());
		System.import('script-loader!select2/dist/js/select2.min.js').then(() => {
			System.import('assets/js/select2-zh-CN.js').then(() => {
				this.selectCompany(); //初始化select 2 车辆
			})
			System.import('assets/js/jstree/jstree.min.js').then(() => {
				this.initCompanyList();
				var tree_box = document.getElementById('tree_box');
				var company = document.getElementById('company');
				document.onclick = function(e: any) {
					if(!(e.target === company || e.target.className === 'jstree-node  jstree-open' || e.target.className === 's_company_root_box' || e.target.className === 'treeSearchInputBox' || e.target.className === 'treeSearchInput' || e.target.className === 'jstree-children' || e.target.className === 's_del_icon' || e.target.className === 'jstree-node  jstree-leaf' || e.target.className === 'jstree-icon jstree-ocl' || e.target.className === 'vision_tree' || e.target.className === 'jstree-node jstree-leaf jstree-closed')) {
						tree_box.className = tree_box.className.replace("tree_open", "");
					}
				}
			})
		})
	}
	ngOnDestroy() {
		document.onclick = null;
	}
	//车辆汇总导出
	export_totle() {
		this.startTime = $('#datetimepicker1').val();
		this.endTime = $('#datetimepicker2').val();
		if(this.startTime == '' || this.endTime == '') {
			this.jsonApiService.message("起始结束时间不能为空");
			return;
		}
		let timeCheck = common.correctTimeParams(this.startTime, this.endTime, 0);
		if(!timeCheck.status) {
			this.jsonApiService.message(timeCheck.message);
			return;
		}
		var type = {
			name: "车辆汇总-" + this.startTime + '至' + this.endTime,
			num: "1"
		}
		this.createForm(type);
	}
	//车辆明细导出
	export_datail() {
		this.startTime = $('#datetimepicker1').val();
		this.endTime = $('#datetimepicker2').val();
		if(this.startTime == '' || this.endTime == '') {
			this.jsonApiService.message("起始结束时间不能为空");
			return;
		}
		let timeCheck = common.correctTimeParams(this.startTime, this.endTime, 0);
		if(!timeCheck.status) {
			this.jsonApiService.message(timeCheck.message);
			return;
		}
		var type = {
			name: "车辆明细-" + this.startTime + '至' + this.endTime,
			num: "2"
		}
		this.createForm(type);
	}
	//导出
	createForm(type) {
		var temdate = new Date();
		var nowTime = temdate.getTime().toString();
		var parameters = {
			deviceId: this.deviceId,
			startTime: this.startTime,
			endTime: this.endTime,
			fileName: type.name + nowTime,
			statsType: type.num,
			dataType: "2",
			searchKey: this.searchKey
		}
		common.exprotDataFile(parameters, 'param', config.BaseURL + 'stats/weightlistExport.html')
	}
	getTime(date) {
		var year = date.getFullYear();
		var month = (date.getMonth() + 1) < 10 ? "0" + (date.getMonth() + 1) : (date.getMonth() + 1);
		var day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();

		return year + "-" + month + "-" + day;
	}
	//初始化时间
	initDate() {
		var that = this;
		return new Promise(function(resolve, reject) {
			System.import('assets/js/datepicker/js/bootstrap-datetimepicker.min.js').then(
				() => {
					System.import('assets/js/datepicker/locales/bootstrap-datetimepicker.zh-CN.js').then(() => {
						$("#datetimepicker1").datetimepicker({ //时间插件
							format: "yyyy-mm-dd",
							language: "zh-CN",
							autoclose: true,
							minView: 2
						}).on("changeDate", function(e) {
							var date = e.date;
							var time = that.getTime(date);
							$("#datetimepicker2").datetimepicker("setStartDate", time);
						});
						$("#datetimepicker2").datetimepicker({ //时间插件
							format: "yyyy-mm-dd",
							language: "zh-CN",
							autoclose: true,
							minView: 2
						}).on("changeDate", function(e) {
							var date = e.date;
							var time = that.getTime(date);
							$("#datetimepicker1").datetimepicker("setEndDate", time);
						});
						var date = new Date();
						$("#datetimepicker2").val(that.getTime(date)); //当前时间
						date.setDate(date.getDate() - 7); //设置前一天
						$("#datetimepicker1").val(that.getTime(date));
						resolve();
					});
				}
			);
		})
	}
	//打开/关闭公司下拉框
	companyClick() {
		$('#tree_box').toggleClass('tree_open');
	}
	//擦除公司所选值
	delText() {
		this.selectedCompanyName = '';
		this.selectedCompanyId = '';
		this.deviceId = '';
		this.stationId = '';
		this.clearSelect2($("#carNumberSelect2")); //清除Select中的数据
		this.clearSelect2($("#deliverySelect2"));
		this.selectCompany();
		$('#company').val("");
		this.companySearch();
		if($('#tree_box')[0].className.indexOf('tree_open') > 0) {
			$('#company').focus();
		}
	}
	//公司树模糊搜索
	companySearch() {
		var value = $('#treeSearchInput').val();
		$("#tree").jstree(true).search(value);
		let searchResult = $('.jstree-search').length;
		if(searchResult < 1) {
			return;
		}
		$('.jstree-search').each(function(index, obj) {
			if(index < 1) { //js树搜索定位到结果的第一个地方；
				var container = $('#vision_tree'),
				scrollTo = $(this);
				container.scrollTop(scrollTo.offset().top - container.offset().top + container.scrollTop() - 130);
				container.animate({
					scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop() - $('#vision_tree').height() * 0.3
				});
			}
		})
	}
	//拉取公司树数据
	initCompanyList() {
		var that = this;
		$('#tree').jstree({
			"core": {
				'data': function(obj, callback) {       
					var jsonstr = "[]";       
					var jsonarray = eval('(' + jsonstr + ')');
					var url = 'company/companytree.html';
					$.ajax({        
						type: "GET",
						        url: config.BaseURL + url,
						        dataType: "json",
						xhrFields: {
							withCredentials: true
						},
						        success: function(result) {
							jsonarray = result;  
							callback.call(this, jsonarray);
						}         
					});      
				},
				"themes": {
					"responsive": true
				},
				"multiple": false,
				"animation": 200,
				"dblclick_toggle": true,
				"expand_selected_onload": true
			},
			"plugins": ["search"]
		}).bind("activate_node.jstree", function(e, obj) {
			var currentNode = obj.node; // 获取当前节点   
			that.selectedCompanyName = currentNode.text;
			that.selectedCompanyId = currentNode.id;
			that.companyId = currentNode.id;
			that.queryCarListByCompanyId(currentNode.id);
			$('#company').val(currentNode.text).change();
			that.companySearch();
		})
	}
	//擦除车牌号码所选值
	del_carNumber() {
		this.deviceId = '';
		this.stationId = '';
		this.clearSelect2($("#deliverySelect2")); //清除淸运点中的数据
		if(this.selectedCompanyId) {
			this.queryCarListByCompanyId(this.selectedCompanyId)
		} else {
			//采用简单粗暴的方法清除;官方推荐的方法失效
			var str = $("<span class='select2-selection__placeholder'>请选择</span>");
			$('#carNumberSelect2').val("");
			$("#select2-carNumberSelect2-container").empty();
			$("#select2-carNumberSelect2-container").attr("title", "");
			$("#select2-carNumberSelect2-container").prepend(str);
		}
	}
	//初始化select2 车辆数据
	selectCompany() {
		var that = this;
		$("#carNumberSelect2").select2({
			language: "zh-CN",
			placeholder: "请选择",
			allowClear: true,
			minimumInputLength: 2, //最少2个字符，select2才显示查询的内容
			ajax: {
				url: config.BaseURL + "stats/carListByCarNumber.html",
				dataType: 'json',
				delay: 50,
				method: "POST",
				xhrFields: {
					withCredentials: true
				},
				data: function(params) {
					return {
						"carNumber": params.term // search term
					};
				},
				processResults: function(data, params) {
					var options = new Array();
					// 小于10个数量才判断重复
					if(data.data.length<=10){
						let arr = []
						let sameCar = []
						// 判断相同的车牌号
						for (let index = 0; index < data.data.length; index++) {
							let car = data.data[index];
							if(arr.indexOf(car.carNumber)!=-1){
								sameCar.push(car.carNumber)
							}else{
								arr.push(car.carNumber);
							}
						}
						$(data.data).each(function(index, car) {
							if(sameCar.indexOf(car.carNumber)!=-1){
								options.push({
									id: car.deviceId,
									text: car.carNumber+"["+car.parentName+"]"
								})
							}else{
								options.push({
									id: car.deviceId,
									text: car.carNumber
								})
							}
						});
					}else{
						$(data.data).each(function(index, car) {
							options.push({
								id: car.deviceId,
								text: car.carNumber
							})
						});
					}
					return {
						results: options //获取查询后的结果
					};
				},
				cache: true
			},
			templateResult: this.formatRepo
		}).on("select2:select", function(e) {
			var data = e.params.data;
			that.deviceId = data.id;
			that.initDeliveryPoint();
		});

		$("#deliverySelect2").select2({
			language: "zh-CN",
			placeholder: "请选择",
			allowClear: true,
		}).on("select2:select", function(e) {
			var data = e.params.data;
			that.stationId = data.id;
		});
	}
	//select2 格式回调函数
	formatRepo(state) {
		if(!state.id) {
			return state.text
		};
		var $state = $('<span><i class="fa fa-car green"></i>&nbsp;&nbsp;' + state.text + '</span>');
		return $state;
	}
	//清除select2 数据
	clearSelect2(obj) {
		obj.empty();
		obj.prepend("<option value=''>请选择</option>");
	}
	//公司id拉取车辆
	queryCarListByCompanyId(companyId) {
		let reqdata = 'companyId=' + companyId;
		this.jsonApiService.http("stats/carlist.html", reqdata).subscribe(data => {
			var carlist = data.data;
			var selectdata = [];
			for(var i = 0; i < carlist.length; i++) {
				var obj = {
					id: carlist[i].deviceId,
					text: carlist[i].carNumber
				};
				selectdata[i] = obj;
			}
			this.carList = selectdata;
			var selectObj = $("#carNumberSelect2");
			var deliverySelect2 = $("#deliverySelect2");
			this.clearSelect2(selectObj); //清除Select中的数据
			this.clearSelect2(deliverySelect2); //清除Select中的数据
			selectObj.select2({
				language: "zh-CN",
				data: selectdata, //为Select添加数据
				templateResult: this.formatRepo
			});
		})
	}
	//清空淸运点值
	del_delivery() {
		this.initDeliveryPoint();
	}
	//设备ID拉取清运站点
	initDeliveryPoint() {
		this.stationId = '';
		let reqdata = 'deviceId=' + this.deviceId;
		this.jsonApiService.http("station/list.html", reqdata).subscribe(data => {
			var carlist = data.data;
			var selectdata = [];
			for(var i = 0; i < carlist.length; i++) {
				var obj = {
					id: carlist[i].id,
					text: carlist[i].name
				};
				selectdata[i] = obj;
			}
			this.deliveryList = selectdata;
			var selectObj = $("#deliverySelect2");
			this.clearSelect2(selectObj); //清除Select中的数据
			selectObj.select2({
				language: "zh-CN",
				data: selectdata, //为Select添加数据
			});
		})
	}
	//查询
	table_search() {
		this.curPage = 1;
		this.searchKey = common.stringTrim(this.searchKey);
		this.load();
	}
	//初始化加载list数据
	load() {
		this.startTime = $('#datetimepicker1').val();
		this.endTime = $('#datetimepicker2').val();
		if(this.startTime == '' || this.endTime == '') {
			this.jsonApiService.message("起始结束时间不能为空");
			return;
		}
		let timeCheck = common.correctTimeParams(this.startTime, this.endTime, 0);
		if(!timeCheck.status) {
			this.jsonApiService.message(timeCheck.message);
			return;
		}
		let reqdata = 'gridPager={"parameters":{"deviceId":"' + this.deviceId + '","stationId":"' + this.stationId + '","startTime":"' + this.startTime + '","endTime":"' + this.endTime + '","searchKey":"' + this.searchKey + '","dataType":"2"}}'
		this.jsonApiService.http("stats/statfordetailpage.html", reqdata).subscribe(data => {
			this.tableData = data;
			this.totalCount = data.length;
			this.client_pages(0, this.pageSize);
		})
	}
	//删除所选时间
	del_date() {
		this.startTime = '';
		this.endTime = '';
		$("#datetimepicker1").val('').change();
		$("#datetimepicker2").val('').change();
		$("#datetimepicker2").datetimepicker("setStartDate", null);
		$("#datetimepicker1").datetimepicker("setEndDate", null);
	}
	client_pages(start, length) {
		this.resultTableData = this.tableData.slice(start, start + length);
	}
	//分页回调
	paginate(e) {
		this.curPage = e.page + 1;
		this.pageSize = e.rows;
		this.client_pages(e.first, e.rows);
	}
}